<template>
    <yplayout>
        <template #header="head">
            <i class="ri-2x ri-database-2-line text-gray-500 ml-2"></i>
            <div class="text-xl px-3" v-html="head.meta.title"></div>
        </template>
        <template #list>
            <div class="flex items-center justify-between">
                <div class="space-x-2">

                </div>
                <div class="flex space-x-2">
                    <div>
                        <button class="btn btn-hong" @click="emits('jumpCom',{to:'out'})">增加</button>
                    </div>
                </div>


            </div>
            <table class="yp-table-datalist text-hui-300">
                <thead class="bg-gray-100">
                    <tr>

                        <th>ID</th>
                        <th>会员</th>
                        <th>单号</th>
                        
                        <th>商品数量</th>
                        <th>商品金额</th>
                        <th>操作员</th>
                        <th>录入时间</th>
                        <th>操作</th>
                    </tr>
                </thead>
                <tbody>
                    <tr class="hover:bg-gray-100 py-1" v-for="(vo,key) in dataList" :key="key">

                      <td>{{vo.id}}</td>
                      <td>{{ vo.member.truename||'无' }}</td>
                      <td>{{ vo.ordersn }}</td>
                      <td>{{ vo.goodsCount }}</td>
                      <td>
                        ￥{{ vo.receiveprice }}
                      </td>
                      <td>
                        {{ vo.admin.truename||vo.admin.username }}
                      </td>
                      <td>{{ vo.create_time }}</td>
                      <td class="text-right">
                        <button class="btn mr-2" @click="view(vo)">查看</button>
                        <button class="btn" v-if="vo.discard">己作废</button>
                        <button class="btn btn-hong" v-else @click="discard(vo)">作废</button>
                      </td>
                    </tr>
                </tbody>
            </table>
            <div class="mt-3" v-if="pageData.pageCount>1">
                <yppage @topage="topage" :pageData="pageData" />
            </div>
        </template>
    </yplayout>
</template>

<script setup>
    import {getData,postData,confirms,alter,authbtn} from "@/api/data"
    import {ref,reactive,onMounted} from "vue"

    const props=defineProps({
        page:{
            default:0
        }
    })
    const emits=defineEmits(['jumpCom'])


    const isLoad=ref(false)

    //分页
    const  pageData=reactive({
        totalRecords:0,//总记录数
        pageCount:0,//总页数
        currentPage:props.page//当前页
    });
    const topage = (page) => {
        pageData.currentPage=page
        getList()
    }
    //数据对象
    const dataList=reactive([])


    const view=(vo)=>{
        emits('jumpCom',{to:'view',id:vo.id,page:pageData.currentPage})
    }


    const getList=async ()=>{
        let resp= await getData('order',{page:pageData.currentPage})
        if(resp.code==1){

            pageData.currentPage = resp.data.current_page
            pageData.pageCount = resp.data.last_page
            pageData.totalRecords = resp.data.total
            dataList.length=0
            for(let i in resp.data.data){
                dataList[i]=resp.data.data[i]
            }
        }
        isLoad.value=true
    }

    const discard=async(item)=>{
        confirms({ text: '确认提交吗？' })
        .then(async()=>{
            const resp= await postData("order/discard",{id:item.id})
            if(resp.code==1){
                alter({ type: 'alter-success', text: resp.msg })
                getList()
            }
        })
        .catch((e)=>{})

    }


    onMounted(() => {

        getList()


    })
</script>